<template>
  <div style="height: 100vh; background-color: #f6f8fb; min-width: 1440px;">
    <router-view></router-view>
    <div style="padding: 24px">
      <div class="noticeDetails">
        <div class="noticeDetails-top">
          <div class="noticeDetails-top-title" @click="handleBack"><i class="el-icon-arrow-left"></i><span>通知详情</span></div>
        </div>
        <div class="noticeDetails-content-all">
          <div class="noticeDetails-content">
            <p>您的dxg服务器即将到期 请及时续费</p>
            <p>您的dxg服务器即将到期，请及时续费您的dxg服务器即将到期，请及时续费您的dxg服务器即将到期，请及时续费您的dxg服务器即将到期，请及时续费您的dxg服务器即将到期，请及时续费，请及时续费您的dxg服务器即将到期，请及时续费您的dxg服务器即将到期，请及时续费</p>
            <p>11月29号</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'message',
  data () {
    return {
      noticeDalId: ''
    }
  },
  mounted () {
    this.noticeDalId = this.$route.params.id
    let listArr = this.noticeDalId
    listArr = JSON.stringify(listArr)
    localStorage.setItem('arr', listArr) // 存储点击记录
    console.log(listArr)
  },
  methods: {
    handleBack () { // 返回上一级
      this.$router.back(-1)
    }
  }
}
</script>
<style scoped>
.noticeDetails{
  background-color: #fff;
  padding: 32px;
  -webkit-box-shadow: 0 1px 4px 0 rgba(0, 21, 41, 0.12);
  box-shadow: 0 1px 4px 0 rgba(0, 21, 41, 0.12);
}
.noticeDetails-top-title span{
  margin-left:10px;font-size:16px;
  cursor: pointer;
}
.noticeDetails-content-all{
  width:100%;
  height:auto;
    background:rgba(255,255,255,1);
  border:1px solid rgba(216,216,216,1);
  display: flex;
  justify-content: center;
  margin-top: 24px
}
.noticeDetails-content{
  padding: 40px
}
.noticeDetails-content p:nth-child(1){
    font-size:24px;
    color:rgba(0,0,0,0.65);
    text-align: center
}
.noticeDetails-content p:nth-child(2){
    font-size:14px;
    color:rgba(0,0,0,0.65);
    margin-top: 24px;
    line-height: 27px
}
.noticeDetails-content p:nth-child(3){
    font-size:14px;
    color:#999999;
    margin-top: 100px;
    text-align: right
}
</style>